<template>
	<view class="content">
		<view class="pageHeader">
			SDVS
			<a class="generalBack" @click="backpage()" hover-class="none">
				<image src="/static/b-1.png" style="width: 18upx;height: 30upx;"></image>
			</a>
		</view>
		<view style=" padding: 180upx 0upx 22upx;z-index: 9999;width: 100%;position: fixed; background: #fff;   display: block;">

			<view style="position: relative;padding:20upx 30upx;">
				<image src="../../static/a-5.png" style="width: 100%;height: 282upx;"></image>
				<view style="position: absolute;top:0;left: 0rpx;color: #fff;text-align: center;width: 100%;top:60upx">
					<view style="font-size: 38upx;">{{ file }}</view>
					<view style="font-size: 28upx;margin-top: 48upx;">当前SDVS总数</view>
				</view>
			</view>


			<view v-if="fileList.length>0" style="z-index: 9999;background: #fff;padding: 24upx 30upx;font-size: 30upx;font-weight: 600;border-bottom: 1upx solid #D9D9D9;"
			>SDVS记录</view>
		</view>
		<view style="z-index:1;padding: 620upx 0upx 22upx;">
			<scroll-view scroll-y="true" class="scroll-Y">
				<view v-if="fileList.length===0" class="empty">
					<image src="/static/empty.png" mode="widthFix"></image>
					<view class="empty-tips">
						暂无SDVS
					</view>
				</view>
				<view v-for="(item, index) in fileList" :key="index" style="padding: 22upx 0;font-size: 28upx;margin-bottom:4upx;background-color: #fff;">
					<view style="padding:0 30upx ;">
						<view style="display: flex;align-items: center;justify-content: space-between;">
							<view style="display: flex; align-items: center;width: 70%;">
								<image v-if="item.type == 0" src="../../static/a-5.png" style="width: 36upx;height: 36upx;margin-right: 20upx;"></image>
								<image v-if="item.type == 1" src="../../static/a-6.png" style="width: 36upx;height: 36upx;margin-right: 20upx;"></image>
								<text style="width: 90%;overflow:hidden; font-size:24upx;text-overflow:ellipsis;display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;">{{ item.msg }}</text>
							</view>
							<text style="font-size: 24upx;">{{ item.new_integral - item.original_integral }}</text>
						</view>
						<view style="display: flex;justify-content: space-between;margin-top: 26upx;padding-left: 56upx;font-size: 24upx;">
							<text>{{ item.add_time_time }}</text>
						</view>
					</view>
				</view>

				<view class="loading">{{ loadingText }}</view>
			</scroll-view>
		</view>
	</view>
</template>
<script>
	import postAjax from '../../API/postAjax.js';

	export default {
		data() {
			return {
				userToken: '', // token
				myinfo: {}, //个人信息
				fileList: [],
				file: '',
				page: 0,
				loadingText: '加载中...'
			};
		},

		onLoad(options) {
			let that = this;
			that.userToken = uni.getStorageSync('token');

			that.file = options.file;
			that.getFileList();
		},
		methods: {
			//滚动到底部

			onReachBottom: function() {
				this.getFileList();
			},


			// 返回上一页
			backpage() {
				uni.navigateBack({
					delta: 1
				});
			},


			//获取订单列表
			getFileList() {
				let that = this;
				uni.showNavigationBarLoading();

				let postdata = {
					token: that.userToken,
					m: that.page,
					n: 20
				};
				// 我的订单列表
				let fileLog = [];

				postAjax('file/FileRecord', postdata, function(data) {
					if (data.code == 0) {
						fileLog = data.data;

						if (fileLog.length > 0) {
							that.fileList = that.fileList.concat(fileLog);

							that.page++; //每触底一次 page +1
						} else {
							that.loadingText = '已加载全部';

						}

						if (that.fileList.length < 10) {
							that.loadingText = '';
						}

					}else{
						that.getFileList()
					}
					uni.hideNavigationBarLoading();
				});
			}
		}
	};
</script>

<style>
	.loading {
		text-align: center;
		line-height: 50px;
		font-size: 30upx;
		color: #666;
	}

	.content {
		min-height: 100vh;
		background-color: #f9f9f9;
	}

	.chargebtn {
		color: #1d84e8;
	}

	.transbtn {
		color: #fff;
		border: 2upx solid #fff;
		background-color: transparent;
		margin-left: 20upx;
	}

	.pageHeader {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99999;
		width: 100%;
		height: 130upx;
		background-color: #1d84e8;
		line-height: 130upx;
		text-align: center;
		font-size: 36upx;
		color: #fff;
		padding-top: 40upx;
		display: block;
	}

	.generalBack {
		position: absolute;
		top: 40upx;
		left: 30upx;
		display: block;
	}

	.empty {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100vh;
		padding-bottom: 100upx;
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
		background: #fff;

	}

	.empty image {
		width:240upx;
		margin-top: 50upx;
	}

	.empty-tips {
		display: flex;
		font-size: 30upx;
		margin-top: 20upx;
		color: #666;

	}

	.rebtn {
		display: inline-block;
		font-size: 30upx;
		border-radius: 4upx;
		width: 120upx;
		height: 58upx;
		line-height: 58upx;
	}

	.rebtn::after {
		border: none;
	}

	.regoodbox {
		z-index: 9999;
		background: red;
		height: 420upx;
		width: 100%;
		display: block;
		padding: 180upx 0upx 22upx;
	}

	.total-wrap {
		width: 100vw;
		height: auto;
		box-sizing: border-box;
		padding: 20upx;
	}

	.logistics-title {
		position: relative;
		box-sizing: border-box;
		padding: 16upx 0;
		border-bottom: 2upx solid #eeeeee;
		line-height: 28upx;
		color: #4b4b4b;
		font-size: 26upx;
		font-family: 'PingFangSC-Medium';
		text-align: left;
	}
</style>
